<!DOCTYPE html>
<html>

	<head>

		<!--适配 移动端-->
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
		<meta charset="utf-8" />

		<meta http-equiv="Pragma" content="no-cache">
		<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate,max-age=0">
		<meta http-equiv="Expires" content="0">

		<!--引入图标-->
		<link rel="icon" href="https://image-links-1259760387.cos.ap-beijing.myqcloud.com/pro_icon_48.ico" type="image/x-icon" />

		<!--引入Bootstrap-->
		<link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
		<script src="js/bootstrap.js"></script>
		<script src="js/bootstrap.bundle.min.js"></script>
		<script src="js/jquery.min.js"></script>
		<!--引入Bootstrap-->

		<title>简连UDP - 命令在线编辑器</title>

		<style type="text/css">
			#edit_p {
				display: flex;
			}
			
			.edit_con {
				background-color: cornsilk;
				width: 50%;
				height: 600px;
				margin: 16px;
			}
			
			.edit_head {
				background-color: darksalmon;
				padding: 8px;
				margin: -8px;
			}
			
			.edit_textarea {
				width: 100%;
				height: 100%;
			}
			
			#head_menu {
				margin: 16px;
			}
			
			textarea {
				border: none;
				/* 隐藏边框 */
				outline: none;
				/* 隐藏轮廓线 */
				background: transparent;
				resize: none;
				padding: 16px;
			}
			
			#edit_title{
				text-align: center;
				padding: 16px;
				margin: 32px;
			}
			
			.btn-group{
				margin: 8px;
			}
		</style>

	</head>

	<body>
		
		<div id="edit_title">
			<h2>简连 - UDP - WebEditer</h2>
		</div>

		<div id="head_menu">

			<div class="btn-group" role="group" aria-label="Basic example">
				<a href="#" class="btn btn-primary active" aria-current="page">快捷键</a>
				<button type="button" class="btn btn-primary">://</button>
				<button type="button" class="btn btn-primary">key</button>
				<button type="button" class="btn btn-primary">string</button>
				<button type="button" class="btn btn-primary">pw</button>
				<button type="button" class="btn btn-primary">num</button>
			</div>

			<div class="btn-group" role="group" aria-label="Basic example">
				<a href="#" class="btn btn-primary active" aria-current="page">编辑</a>
				<button type="button" class="btn btn-primary">新命令</button>
				<button type="button" class="btn btn-primary">复制全部</button>
				<button type="button" class="btn btn-primary">转换为Json</button>
			</div>

<div class="btn-group" role="group" aria-label="Basic example">
				<a href="#" class="btn btn-primary active" aria-current="page">帮助</a>
				<button type="button" class="btn btn-primary">基本命令介绍</button>
			</div>

			<div class="btn-group" role="group" aria-label="Basic example">
				<a href="#" class="btn btn-primary active" aria-current="page">实验</a>
				<button type="button" class="btn btn-primary">运行</button>
			</div>

		</div>

		<div id="edit_p">

			<div id="edit_left" class="edit_con card">
				<div class="edit_head">
					简连命令
				</div>

				<textarea class="edit_textarea">
						
					</textarea>

			</div>

			<div id="edit_right" class="edit_con card">
				<div class="edit_head">
					JSON
				</div>

				<textarea class="edit_textarea">
						
				</textarea>
			</div>
		</div>

	</body>

	<script type="text/javascript">
		
		$('.edit_textarea').text("");
		
	</script>

</html>